// 颜色
$colors: (
  "white": #ffffff,
  "black": #000000
);

// 字体大小
$base-font-size: 16px;
$font-sizes: (
  xxs: 0.1,
  //8px
  xs: 0.125,
  //10px
  sm: 0.2875,
  //12px
  md: 0.1625,
  //13px
  lg: 0.175,
  //14px
  xl: 0.2,
  //16px
  xxl: 0.225,
  //18px
  xxxl: 0.25 //20px,,,,
);

// 宽高
.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.m-auto {
  margin: 0 auto !important;
}


//flex
.d-flex {
  display: flex;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.flex-1 {
  flex: 1;
}

$flex-jc: (
  start: flex-start,
  end: flex-end,
  center: center,
  between: space-between,
  around: space-around,
  evenly: space-evenly,
);

$flex-ai: (
  start: flex-start,
  end: flex-end,
  center: center,
  stretch: stretch,
);
$flex-ac: (
  start: flex-start,
  end: flex-end,
  center: center,
  between: space-between,
  around: space-around,
  evenly: space-evenly,
);

.flex-1 {
  flex: 1;
}

.flex-a {
  flex: auto;
}

//spacing
$spacing-types: (
  m: margin,
  p: padding,
);
$spacing-directions: (
  t: top,
  r: right,
  b: bottom,
  l: left,
);
$spacing-base-size: 1rem;
$spacing-sizes: (
  0: 0,
  1: 0.25,
  2: 0.5,
  3: 1,
  4: 1.5,
  5: 3,
  6: 4.5,
  7: 5,
  8:6.5
);
$wheight-sizes: (
  1:1%,
  5:5%,
  8:8%,
  10:10%,
  11:11%,
  115:11.5%,
  12:12%,
  15:15%,
  20:20%,
  25:25%,
  28:28%,
  30:30%,
  32:32%,
  35:35%,
  36:36%,
  37:37%,
  38:38%,
  40:40%,
  42:42%,
  44:44%,
  45:45%,
  48:48%,
  50:50%,
  53:53%,
  55:55%,
  60:60%,
  65:65%,
  69:69%,
  70:70%,
  80:80%,
  85:85%,
  88:88%,
  90:90%,
  91:91%,
  92:92%,
  94:94%,
  95:95%,
  99:99%
);
$spacing-radius-border: 10px;